<template>
  <div>
    <x-header id="header" :left-options="{backText: ''}">客户经理</x-header>
    <div class="main main-header">
      <div class="manager ">
        <div class="name" >
          <div class="head">
            <img class="icon" src="../../../static/img/user.png" />
            <div class="title">客户经理</div>
          </div>
          <div class="content">李霞</div>
        </div>
        <div class="mobile" >
          <div class="head">
            <img class="icon" src="../../../static/img/phone2.png"/>
            <div class="title">联系电话</div>
          </div>
          <div class="content">13777777777</div>
        </div>
        <div class="save">
          <x-button class="save-button" >联系客户经理</x-button>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'manager'
}
</script>

<style scoped>
  .main {
    overflow: auto;
    background-image: radial-gradient(46% 99%, #F98657 50%, #F14E2C 100%);
    min-height: 100vh;
  }
  .manager {
    background: #fff;
    display: flex;
    flex-direction: column;
    margin: 1rem auto 0;
    padding: 1.5rem;
    border-radius: 10px;
    width: 19.64rem;
  }
  .header {
    display: flex;
  }
  .icon {
    padding-right: 0.7rem;
    height: 1.5rem;
    width: 1.5rem;
  }
  .title {
    flex:1;
    color: #8D8D8D;
  }
  .content {
    margin: 1.5rem 0 2rem;
    color: #5B5B5B;
    font-size: 20px;
  }
  .save {
    margin-top: 0;
    width: 100%;
  }
  .save-button {
    background: #FE9E2E;
    color: #fff;
  }
</style>
